﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <!-- 若您需要使用Kendo UI Professional，请联系版权人获得合法的授权或许可。 -->
    
    <!-- Bootstrap css -->
    <link href="https://magicbox.bkclouds.cc/static_api/v3/assets/bootstrap-3.3.4/css/bootstrap.min.css" rel="stylesheet">
    <!-- kendo ui css -->
    <link href="https://magicbox.bkclouds.cc/static_api/v3/assets/kendoui-2015.2.624/styles/kendo.common.min.css" rel="stylesheet">
    <link href="https://magicbox.bkclouds.cc/static_api/v3/assets/kendoui-2015.2.624/styles/kendo.default.min.css" rel="stylesheet">
    <!-- font-awesome -->
    <link href="https://magicbox.bkclouds.cc/static_api/v3/assets/fontawesome/css/font-awesome.css" rel="stylesheet">
    <!--蓝鲸提供的公用样式库 -->
    <link href="https://magicbox.bkclouds.cc/static_api/v3/bk/css/bk.css?v=1.0.1" rel="stylesheet">
    <!-- 如果要使用Bootstrap的js插件，必须先调入jQuery -->
    <script src="https://magicbox.bkclouds.cc/static_api/v3/assets/js/jquery-1.10.2.min.js"></script>
    <!-- 包括所有bootstrap的js插件或者可以根据需要使用的js插件调用　-->
    <script src="https://magicbox.bkclouds.cc/static_api/v3/assets/bootstrap-3.3.4/js/bootstrap.min.js"></script>
    <!-- 包括所有kendoui的js插件或者可以根据需要使用的js插件调用　-->
    <script src="https://magicbox.bkclouds.cc/static_api/v3/assets/kendoui-2015.2.624/js/kendo.all.min.js"></script>
    <script src="https://magicbox.bkclouds.cc/static_api/v3/bk/js/bk.js"></script>
    <!-- 以下两个插件用于在IE8以及以下版本浏览器支持HTML5元素和媒体查询，如果不需要用可以移除 -->
    <!--[if lt IE 9]>
    <script src="https://magicbox.bkclouds.cc/static_api/v3/assets/js/html5shiv.min.js"></script>
    <script src="https://magicbox.bkclouds.cc/static_api/v3/assets/js/respond.min.js"></script>
    <![endif]-->
    <!-- 数据埋点统计 -->
    <script src="https://magicbox.bkclouds.cc/static_api/analysis.js"></script>


</head>
<body>



<div>
<!--
如果没有引用以下文件，请去掉此注释
<link href="https://magicbox.bkclouds.cc/static_api/v3/assets/select2-3.5.2/select2.css" rel="stylesheet">
<script src="https://magicbox.bkclouds.cc/static_api/v3/assets/select2-3.5.2/select2.js"></script>
-->
<!-- 
<div class="plugin3_demo" id="plugin3_demo1" style="display:inline-block;">  
-->

    <!-- select2 静态 start -->
   <form class="form-vertical p15")
   
   
   <p>下拉框选择测试 <pre> QQ: 41208966   网名： 随风飘来  </pre> </p>

    <select onchange="myselect1(this.options[this.options.selectedIndex].value)" id="blueking" style="width:300px;">
        <option value="bk1">test</option>
        <option value="bk2">爬山</option>
        <option value=${data}>蓝鲸</option>
        <option value="bk4">跑步</option>
        <option value="bk5">羽毛球</option>
    </select>

    <script type="text/javascript">
     function myselect1(v){
     var data= "this is a test for data";
     alert(v);
     }
   </script>



   </form>



 
<!--  =========================  -->
<!--
 <form class="form2">
‍‍<select id="pid" onchange="gradeChange(this.options[this.options.selectedIndex].value)">

    <option grade="1" value="a">选项一</a>

    <option grade="2" value="b">选项二</a>

</select>

<script type="text/JavaScript">
       function gradeChange(v){
        var objS = document.getElementById("pid");
       
      
        alert(v);
       }
</script>
</form>
-->



<!--


<script type="text/javascript">
function getIndex()
  {
  var x=document.getElementById("mySelect")
  alert(x.options[x.selectedIndex].value);
  }
</script>


<form>
Select your favorite fruit:
<select id="mySelect">
  <option value="20">Apple</option>
  <option value="30">Orange</option>
  <option value="40">Pineapple</option>
  <option value="50">Banana</option>
</select>
<br /><br />
<input type="button" onclick="getIndex()"
value="Alert index of selected option">
</form>


-->

    <!-- select2 静态 end -->
<!--


</div> 





</div>



<!--HTML-->
<nav>
    <!-- 横向导航九-1 Start -->
    <div class="nav king-horizontal-nav10" id="horizontal_nav_demo10">
        <div class="navbar-header">
            <a href="#" class="navbar-brand">
                <img src="https://magicbox.bkclouds.cc/static_api/v3/bk/images/logo.png" class="logo">
            </a>
        </div>
        <ul class="nav navbar-nav">
            <li class="active"><a href="javascript:;">业务首页</a></li>
            <li><a href="javascript:;">任务管理</a></li>
            <li><a href="javascript:;">模板管理</a></li>
            <li><a href="javascript:;">业务配置</a></li>
            <li><a href="javascript:;">职业化中心</a></li>
            <li class="navslip" id="navslip"></li>
        </ul>
        <div class="navbar-header pull-right">
            <ul class="nav">
                <li class="user-info">
                    <a href="javascript:;">
                        <span class="f12">admin</span><img src="https://magicbox.bk.tencent.com/static_api/v3/components/horizontal_nav10/images/avatar.png" class="img-rounded">
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <!-- 横向导航九-1 End -->
</nav><!--JS-->
<script src="https://magicbox.bkclouds.cc/static_api/v3/assets/js/jquery-1.10.2.min.js"></script>
<script src="https://magicbox.bkclouds.cc/static_api/v3/assets/bootstrap-3.3.4/js/bootstrap.min.js"></script>
<script src="https://magicbox.bkclouds.cc/static_api/v3/assets/kendoui-2015.2.624/js/kendo.all.min.js"></script>
<script src="https://magicbox.bkclouds.cc/static_api/v3/bk/js/bk.js"></script>
<script type="text/javascript">
	//horizontal_nav_demo10_js_start
	$(function(){
		var slip=$("#navslip");
		var flag=true;
		$(".navbar-nav").on("mouseenter","li",function(){
			slip.show();
			if(flag){
				slip.css({width:$(this).width(),left:parseInt($(this).position().left)})
				flag=false;
			}else{
				slip.stop().animate({
					width:$(this).width(),
					left:parseInt($(this).position().left)
				})
			}
		});
		$(".navbar-nav").on("mouseleave",function(){
			slip.hide();
			flag=true;
		});
	});
	//horizontal_nav_demo10_js_end
</script>







<!--
如果没有引用以下文件，请去掉此注释
<link href="https://magicbox.bkclouds.cc/static_api/v3/assets/bootstrap-3.3.4/css/bootstrap.min.css" rel="stylesheet">
<link href="https://magicbox.bkclouds.cc/static_api/v3/bk/css/bk.css?v=1.0.1" rel="stylesheet">
-->
<!--
<div class="king-vertical-nav5 king-vertical-nav5-success fl ml50 mb30 " style="width:200px;">
-->
<div class="king-vertical-nav5 king-full-height" style="width:220px;">
    <ul class="sidebar">
        <li class="sidebar-main">
            <a href="javascript:;">
                首页 <span class="menu-icon glyphicon glyphicon-home"></span>
            </a>
        </li>
        <li class="sidebar-title">
            <span>综合分类</span>
        </li>
        <li class="sidebar-item current">
            <a href="javascript:;">数据报表 <span class="menu-icon glyphicon glyphicon-th"></span></a>
        </li>
        <li class="sidebar-item">
            <a href="javascript:;">安全审计 <span class="menu-icon glyphicon glyphicon-screenshot"></span></a>
        </li>
        <li class="sidebar-item">
            <a href="javascript:;">单据事务 <span class="menu-icon glyphicon glyphicon-list"></span></a>
        </li>
        <li class="sidebar-title separator">
            <span>系统管理</span>
        </li>
        <li class="sidebar-item">
            <a href="javascript:;">账户设置 <span class="menu-icon glyphicon glyphicon-user"></span></a>
        </li>
        <li class="sidebar-item">
            <a href="javascript:;">密码修改 <span class="menu-icon glyphicon glyphicon-edit"></span></a>
        </li>
    </ul>
</div>







</body>
</html>